
export default (Vue) => {
    // 拖动指令
    Vue.directive('draggable', {
        mounted: function (el, binding) {
            const mouseDown = (e) => {
                const disX = e.clientX - el.offsetLeft
                const disY = e.clientY - el.offsetTop
                document.onmousemove = (e) => {
                    let l = e.clientX - disX
                    let t = e.clientY - disY
                    if (l <= 0) {
                        l = 0
                    } else if (
                        l >
                        document.documentElement.clientWidth - el.offsetWidth
                    ) {
                        l =
                            document.documentElement.clientWidth -
                            el.offsetWidth
                    }
                    if (t <= 0) {
                        t = 0
                    } else if (
                        t >
                        document.documentElement.clientHeight - el.offsetHeight
                    ) {
                        t =
                            document.documentElement.clientHeight -
                            el.offsetHeight
                    }
                    el.style.left = l + 'px'
                    el.style.top = t + 'px'
                }
                document.onmouseup = () => {
                    document.onmousemove = null
                    document.onmouseup = null
                }
            }
            const draggableElement = document.getElementById(binding.value)
            if (draggableElement) {
                draggableElement.onmousedown = mouseDown
            } else {
                el.onmousedown = mouseDown
            }
        }
    })
}
